const app = getApp();
const WXAPI = require('../../main/main')
var dateTimePicker = require('../../../utils/DateUtil.js');
var TOOL = require('../../../utils/util.js');
import WxValidate from '../../../utils/wxValidate/WxValidate.js'
Page({

  /**
   * 页面的初始数据
   */
  data: {
    backgroundColor: app.globalData.currentBgColor, //皮肤颜色
    StatusBar: 20, //遵循cu-custom的设置，与系统无关
    CustomBar: 74, //遵循cu-custom的设置，与系统无关
    SystemHeight: app.globalData.SystemHeight, //系统可用高度
    SystemWidth: app.globalData.SystemWidth, //系统可用宽度
    ScreenHeight: app.globalData.ScreenHeight, //系统宽度
    StatusBarHeight: app.globalData.StatusBarHeight, //状态宽度
    TabBarHeight: 50,
    loadModal: false,

    /**单列选择**/
    singleSelectIndex: null, //单列选择索引
    singleSelect: ['访问事由1', '访问事由2', '访问事由3'], //单列选择值
    /**具体时间选择框**/
    startYear: 2000, //开始时间
    endYear: 2050, //结束时间
    dateTimeArray1: null, //选择框各列值数组
    dateTimeArray2: null,
    dateTime1: null, //选择时间数组的索引
    dateTime2: null,
    startTime: '',//选择后开始时间值
    endTime: '', //选择后结束时间值
    // relTime: '', //选择后具体时间值（可使用的 yyyy-MM-dd HH:mm:ss）
    detail: null, //身份证信息
    /**图片上传**/
    FileList: [], //文件上传列表
    // 表单验
    form: {
      name: '',
      phone: '',
      idCard: ''
    }
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var that = this;
    that.setDefaultDateTime1(); //设置默开始时间
    that.setDefaultDateTime2(); //设置默结束时间
    this.initValidate() //验证规则函数
  },

  // 身份证识别
  successIden:function(e){
    console.log("身份证正面",e);
    var that=this;
    that.setData({
      detail:e.detail
    })
  },

  /**
   * 单列选择器改变方法
   */
  singleSelectChange(e) {
    console.log(e);
    this.setData({
      singleSelectIndex: e.detail.value
    })
  },

  /**设置具体时间选择器页面加载默认值**/
  setDefaultDateTime1() {
    // 获取完整的年月日 时分秒，以及默认显示的数组
    var obj = dateTimePicker.dateTimePicker(this.data.startYear, this.data.endYear);
    var dateArr = obj.dateTimeArray;
    var timeIndex = obj.dateTime;
    this.setData({
      dateTimeArray1: obj.dateTimeArray,
      dateTime1: obj.dateTime,
      startTime: dateArr[0][timeIndex[0]] + '-' + dateArr[1][timeIndex[1]] + '-' + dateArr[2][timeIndex[2]] +
        ' ' + dateArr[3][timeIndex[3]] + ':' + dateArr[4][timeIndex[4]] + ':' + dateArr[5][timeIndex[5]],
    });
  },
  setDefaultDateTime2() {
    var obj = dateTimePicker.dateTimePicker(this.data.startYear, this.data.endYear);
    var dateArr = obj.dateTimeArray;
    var timeIndex = obj.dateTime;
    this.setData({
      dateTimeArray2: obj.dateTimeArray,
      dateTime2: obj.dateTime,
      endTime: dateArr[0][timeIndex[0]] + '-' + dateArr[1][timeIndex[1]] + '-' + dateArr[2][timeIndex[2]] +
        ' ' + dateArr[3][timeIndex[3]] + ':' + dateArr[4][timeIndex[4]] + ':' + dateArr[5][timeIndex[5]],
    });
  },
  /**具体时间选择框值改变事件**/
  changeStartTime(e) {
    let arr = this.data.dateTime1,
      dateArr = this.data.dateTimeArray1;
    let timeIndex = this.data.dateTime1;
    this.setData({
      dateTime1: e.detail.value,
      startTime: dateArr[0][timeIndex[0]] + '-' + dateArr[1][timeIndex[1]] + '-' + dateArr[2][timeIndex[2]] +
        ' ' + dateArr[3][timeIndex[3]] + ':' + dateArr[4][timeIndex[4]] + ':' + dateArr[5][timeIndex[5]],
    });
  },
  changeEndTime(e) {
    let arr = this.data.dateTime2,
      dateArr = this.data.dateTimeArray2;
    let timeIndex = this.data.dateTime2;
    this.setData({
      dateTime2: e.detail.value,
      endTime: dateArr[0][timeIndex[0]] + '-' + dateArr[1][timeIndex[1]] + '-' + dateArr[2][timeIndex[2]] +
        ' ' + dateArr[3][timeIndex[3]] + ':' + dateArr[4][timeIndex[4]] + ':' + dateArr[5][timeIndex[5]],
    });
  },

  /**具体时间列改变事件**/
  changeDateTimeColumn1(e) {
    var arr = this.data.dateTime1,
      dateArr = this.data.dateTimeArray1;
    arr[e.detail.column] = e.detail.value;
    dateArr[2] = dateTimePicker.getMonthDay(dateArr[0][arr[0]], dateArr[1][arr[1]]);
    this.setData({
      dateTimeArray1: dateArr,
      dateTime1: arr,
    });
  },
  changeDateTimeColumn2(e) {
    var arr = this.data.dateTime2,
      dateArr = this.data.dateTimeArray2;
    arr[e.detail.column] = e.detail.value;
    dateArr[2] = dateTimePicker.getMonthDay(dateArr[0][arr[0]], dateArr[1][arr[1]]);
    this.setData({
      dateTimeArray2: dateArr,
      dateTime2: arr,
    });
  },


  /**图片上传选择图片**/
  ChooseImage() {
    wx.chooseImage({
      count: 4, //默认9
      sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
      // sourceType: ['album', 'camera'], //从相册选择
      sourceType: ['camera'], //从相册选择
      /**图片选择成功回调函数**/
      success: (res) => {
        if (this.data.FileList.length != 0) {
          this.setData({
            FileList: this.data.FileList.concat(res.tempFilePaths)
          })
        } else {
          this.setData({
            FileList: res.tempFilePaths
          })
        }
      },
      /**图片选择失败回调函数**/
      fail: (res) => {
        console.log("图片选择失败，错误如下:");
        console.log(res);
      },
      /**接口调用结束的回调函数（调用成功、失败都会执行）**/
      complete: (res) => {

      },
    });
  },
  /**选择图片点击预览的图**/
  ViewImage(e) {
    wx.previewImage({
      urls: this.data.FileList,
      current: e.currentTarget.dataset.url
    });
  },
  /**点击X去清楚当前的图片文件**/
  DelImg(e) {
    this.data.FileList.splice(e.currentTarget.dataset.index, 1);
    this.setData({
      FileList: this.data.FileList
    });
  },

  //报错 
  showModal(error) {
    wx.showModal({
      content: error.msg,
      showCancel: false,
    })
  },

  //验证函数
  initValidate() {
    const rules = {
      name: {
        required: true,
        minlength: 2
      },
      phone: {
        required: true,
        tel: true
      },
      idcard: {
        required: true,
        idcard: true
      }
    }
    const messages = {
      name: {
        required: '请填写姓名',
        minlength: '请输入正确的名称'
      },
      phone: {
        required: '请填写手机号',
        tel: '请填写正确的手机号'
      },
      idcard: {
        required: '请填写身份证号',
        idcard: '请填写正确的身份证号'
      }
    }
    this.WxValidate = new WxValidate(rules, messages)
  },

  /****
   * @funtction 提交数据事件
   */
  formSubmit(e) {
    var that = this;
    console.log('form发生了submit事件，携带的数据为：', e.detail.value)
    const params = e.detail.value
    //校验表单
    if (!this.WxValidate.checkForm(params)) {
      const error = this.WxValidate.errorList[0]
      this.showModal(error)
      return false
    }
    wx.showModal({
      title: '提示',
      content: '预约后不可更改预约信息，是否确定预约？',
      success(res) {
        if (res.confirm) {
          that.setData({
            loadModal: true
          })
          // 走后台提交...
        } else if (res.cancel) {
          console.log('用户点击取消')
        }
      }
    })
  }
})